import React from 'react';
import s from './style.module.css';
import TokenPane from './tokenPane';
import URLPane from './urlPane';
import BreadCrumb from '@/components/BreadCrumb';
import { Tabs } from '@knownsec/react-component';

const { TabPane } = Tabs;

export default function backupRecovery() {
  return (
    <>
      <BreadCrumb
        arr={[
          { link: '', name: '用户管理' },
          { link: '', name: 'API管理', active: true },
        ]}
      />
      <div className={s.backupRecovery}>
        <div className={s.bBox}>
          <Tabs animated defaultActiveKey={'1'}>
            <TabPane tab={<span className={s.tabTitle}>授权Token</span>} key={1}>
              <TokenPane />
            </TabPane>
            <TabPane
              tab={
                <span className={s.tabTitle}>
                  推送URL
                </span>
              }
              key={2}
            >
              <URLPane />
            </TabPane>
          </Tabs>
        </div>
      </div>
    </>
  );
}
